<template>
	<view>
		<!-- 自定义头部导航 -->
		<page-meta>
		    <navigation-bar
		      :title="'物料配送'"
		      front-color="#000000"
		      background-color="#FBFBFF"
			  fixed
		    />
		</page-meta>
		<u-line></u-line>
		<u-list @scrolltolower="scrolltolower" class="list" v-if="total">
		  <u-list-item v-for="(item, index) in indexList" :key="item.id" @click="leftButtonClick(item)">
		    <view class="card">
		      <view class="right">
		        <view class="title">
		          &nbsp;&nbsp;<b>物料：{{ item.materialCode }}(支架)</b>
		        </view>
		        <view class="body">
		          &nbsp;&nbsp;工作中心：{{ item.produceLineCode }}&nbsp;&nbsp;&nbsp;{{ item.workshopName }}
		        </view>
		        <view class="body">
		          <br />
		          &nbsp;&nbsp;要货时间：{{ item.createTime }}
		        </view>
		      </view>
		     
		    </view>
		  </u-list-item>
		</u-list>
		<!-- 空数据 -->
		<view v-else>
			<u-empty mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty>
		</view>
		<!-- 回到顶部 -->
		<u-back-top :scroll-top="scrollTop" top="600"></u-back-top>
	</view>
</template>

<script setup lang="ts">
import {reactive, ref} from 'vue';
import {onPullDownRefresh, onPageScroll } from '@dcloudio/uni-app';
import { http } from '@/utils/http';
import { PageResult } from '@/types/type';
const umodel = reactive({
  storageUnitCode: '',
  storageTypeId: '',
  storageTypeCode: '',
  storageTypeName: '',
  storageSectionId: '',
  storageSectionCode: '',
  binId: '',
  binCode: '',
  materialCode: '',
  totalQuantity: '',
  supplyBatch: '',
});

// 重置表单信息 & 光标自动blur

const indexList = ref([]);
let ids = []; 
const current = ref(0);
const totalPage = ref(0);
const total = ref(0);

const scrollTop = ref(0);

onPageScroll((e)=> {
	console.log('滚动', e)
	scrollTop.value = e.scrollTop
})
	loadmore();
onPullDownRefresh(()=> {
	current.value = 0;
	indexList.value = [];
	loadmore('refresh');
})
async function loadmore (type?: string) {
	try{
		current.value += 1
		const result: PageResult<any>  = await http({
			method: 'POST',
			url: '/wms/lesproducematerialrequest/queryByPage',
			data: {
				current: current.value,
				size: 20,
				data: {
					
				}
			}
		})
		console.log('222222222222222', result.data);
		const list = result.data;
		totalPage.value = result.page;
		total.value = result.total;
		for (let i = 0; i < list.length; i++) {
			indexList.value.push(list[i]);
			getStorageUnit(i);
		}
		
		type === 'refresh' && uni.stopPullDownRefresh();
	}catch(e){
		console.log(e)
	}
	
	
}

async function getStorageUnit(i) {
  const data = await http({
    url: `/mdm/mdmworkshop/getByCode/${indexList.value[i].produceLineCode}`,
    method: 'GET',
    data: {
    }
  });
   // 将获取到的工作中心信息插入到 indexList 中的对应位置
      indexList.value[i].workshopName = data.data.workshopName; 
      }
function leftButtonClick(item) {
    if (item.index === 0) {
      showImport.value = true;
    } else {
      // 导航到 bin 页面，并传递物料号参数
      uni.navigateTo({
        url: '/pages/use/materialrequest/bin?id=' + item.materialCode+'&requestId=' + item.id+'&workshopName=' + item.workshopName,
      });
    }
  }
const showImport = ref(false);
const scrolltolower = () => {
	totalPage.value > current.value && loadmore();
};
</script>

<style lang="scss" scoped>
	.list {
		.card {
			margin-top: 5px;
			margin-bottom: 10px;
			border-radius: 7px;
			display: flex;
			align-items: center;
			padding: 10px 0;
			transition: all 300ms ease;
			box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
		
			.left {
				// flex-basis: 90rpx;
				padding-right: 10px;
				text-align: right;
				font-size: 13px;
		
				.enter {
					line-height: 20px;
					margin-bottom: 5px;
				}
		
				.number {
					font-size: 13px;
					line-height: 18px;
				}
		
				:deep(.u-icon--right) {
					flex-direction: row-reverse;
				}
			}
		
			.right {
				flex: 1;
				padding-left: 15px;
		
				.title {
					font-size: 15px;
					line-height: 20px;
					margin-bottom: 5px;
					font-weight: 700;
				}
		
				.body {
					font-size: 13px;
					line-height: 18px;
				}
			}
		}
	}
</style>
